<template>
  <div
    v-loading="true"
    class="loading"
    style="font-size: 72px"
    element-loading-spinner="el-icon-loading"
  >&nbsp;</div>
</template>

<script>
import { head } from 'lodash'
import { mapGetters } from 'vuex'
export default {
  name: 'Loading',
  computed: {
    ...mapGetters(['routes'])
  },
  mounted() {
    const headRoute = head(
      this.routes.filter(k => k.isTableRoute)
    )
    this.$nextTick(() => {
      this.$router.push({
        path: headRoute && headRoute.path
      })
    })
  }
}
</script>

<style lang="scss" scoped>
  .loading {
    width: 50%;
    height: 50%;
  }
</style>
